<!--
 * @Author: daifen
 * @Date: 2020-06-16 14:10:41
 * @LastEditors: Please set LastEditors
--> 
<template>
  <div>
    <el-select
      :clearable="sClearable"
      :disabled="disabled"
      :class="sClass"
      v-model="svalue"
      sPlaceholder="全部"
      @change="sChange"
      style="width:100%;"
    >
      <el-option
        v-for="dict in distList"
        :key="dict.keyField"
        :label="dict.valueField"
        :value="dict.keyField"
      ></el-option>
    </el-select>
  </div>
</template>

<script>
import { getSelectValueBySql } from "@/api/system/duplicate";
export default {
  name: "commonGetSelect",
  props: {
    value: {
      type: [String],
    },
    sClass: {
      type: String,
      default: "querySelect",
    },
    sClearable: {
      type: Boolean,
      default: true,
    },
    disabled: {
      type: Boolean,
      default: false,
    },
    //字段名
    fieldName: {
      type: String,
      default: "",
    },
    //值的字段名
    keyFieldName: {
      type: String,
      default: "",
    },
    //表的名字
    tableName: {
      type: String,
      default: "",
    },
    //查询条件
    whereSql: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
      distList: [], //渲染下拉框的数据列表
      svalue: "",
      // newVal:''
    };
  },
  filters: {},
  created() {
    this.getSelectValueBySqls();

    this.svalue = this.value + "";
  },
  methods: {
    sChange() {
      this.$emit("sChange");
    },
    //获取封装的下拉框的接口数据
    getSelectValueBySqls() {
      let json = {
        fieldName: this.fieldName,
        keyFieldName: this.keyFieldName,
        tableName: this.tableName,
        whereSql: this.whereSql,
      };
      getSelectValueBySql(json).then((res) => {
        this.distList = res.data;
      });
    },
  },
  watch: {
    value(newVal) {
      // if (syUtiles.commonUtils.isEmpty(newVal)) {
      if (this.isEmpty(newVal)) {
        this.svalue = newVal;
        return;
      }
      this.svalue = newVal + "";
    },
    svalue(newVal, oldVal) {
      if (newVal !== oldVal) {
        this.$emit("input", this.svalue);
      }
    },
  },
};
</script>

<style lang="scss" scoped>
.el-dropdown-link {
  cursor: pointer;
  color: #409eff;
}
.el-icon-arrow-down {
  font-size: 12px;
}
</style>